<template>
  <div class="mainimg">
    <div class="Topimg">
      <h3>主要任务</h3>
      <Bell @click="ling" class="LidgdangClass"></Bell>
      <img src="../../images/B1B38435FFD00EC77726F758AB149CE7.png" alt="" @click="MyWz" />
      <img src="../../images/D6E73662F6567AC19BCE4CFC3AB28D81.png" alt="" @click="MyYd" />
    </div>
    <div class="Bottonimg">
      <h3 @click="Tui">我的信息</h3>
      <img
        src="../../images/F8C675140F4F8A902AC37B506E6AE76E.png"
        alt=""
        @click="Myxin"
      />
    </div>
  </div>
</template>
<script setup>
import Bell from "../../components/Bell.vue";
import { useRouter } from "vue-router";
const router = useRouter();
const MyWz = () => {
  router.push("/header/PatientList");
};
const ling = () => {
  router.push("/Message");
};
const MyYd = () => {
  router.push("/AnswerComponent");
};
const Myxin = () => {
  router.push("/Myimt");
};
const Tui = () => {
  router.push("/LoginTui");
};
</script>
<style lang="scss" scoped>
.mainimg {
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100%;
  width: 100%;
  background-color: #f1f1f1;
  .Topimg {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    h3 {
      color: aqua;
    }
    img {
      width: 80%;
    }
  }
  .Bottonimg {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    h3 {
      color: aqua;
    }
    img {
      width: 80%;
    }
  }
}
.LidgdangClass {
  position: fixed;
  top: 0;
  right: 0;
}

.loading-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
}
</style>
